import Vue from "vue";
import VueRouter from "vue-router";
import Home from "../views/Home.vue";

// 解决编程式路由往同一地址跳转时会报错的情况
const originalPush = VueRouter.prototype.push;
const originalReplace = VueRouter.prototype.replace;

// push
VueRouter.prototype.push = function push(location, onResolve, onReject) {
    if (onResolve || onReject)
        return originalPush.call(this, location, onResolve, onReject);
    return originalPush.call(this, location).catch(err => err);
};

//replace
VueRouter.prototype.replace = function push(location, onResolve, onReject) {
    if (onResolve || onReject)
        return originalReplace.call(this, location, onResolve, onReject);
    return originalReplace.call(this, location).catch(err => err);
};



Vue.use(VueRouter);

const routes = [{
        //首页
        path: "/home",
        name: "home",
        component: Home,
    },
    {
        // /的路由重定向
        path: "/",
        redirect: '/home'
    },
    {
        //分类
        path: "/list",
        name: "list",
        component: () =>
            import ("../views/List.vue"),
    },
    {
        path: "/cart",
        name: "cart",
        meta: {
            keepAlive: false //此组件不需要被缓存
        },
        component: () =>
            import ("../views/Cart.vue"),
    },
    {
        //我的
        path: "/my",
        name: "My",
        component: () =>
            import ("../views/My.vue"),
    },
    {
        //搜索页面
        path: "/search",
        name: "Search",
        children: [{
                // 相当于搜索页面跳转的页面（搜索列表）
                path: "/search-list",
                name: "search-list",
                component: () =>
                    import ("../views/search/Search-list.vue"),
            },
            // 主页面进入搜索页面的默认路径
            {
                path: "/",
                name: "search-index",
                component: () =>
                    import ("../views/search/Search-index.vue")
            }
        ],
        component: () =>
            import ("../views/Search.vue"),
    },
    {
        //商品详情页
        path: '/detail',
        name: 'Detail',
        meta: {
            keepAlive: true //此组件需要被缓存
        },
        component: () =>
            import ("../views/Detail.vue")

    },
    {
        //密码登录
        path: '/login',
        name: 'Login',
        component: () =>
            import ("../views/login/Login.vue")
    },
    {
        path: '/userlogin',
        name: 'UserLogin',
        component: () =>
            import ("@/views/login/UserLogin.vue")
    },
    {
        //注册
        path: '/register',
        name: 'Register',
        component: () =>
            import ('@/views/login/Register.vue')
    },
    {
        //忘记密码
        path: '/recovery',
        name: 'Recovery',
        children: [{
                path: '/',
                name: 'RecoveryIndex',
                component: () =>
                    import ('@/views/Recovery/RecoveryIndex.vue')
            },
            {
                path: '/recoverybtn',
                name: 'RecoveryBtn',
                component: () =>
                    import ('../views/Recovery/RecoveryBtn.vue')

            }
        ],
        component: () =>
            import ('@/views/Recovery/Recovery.vue')
    },
    {
        //地址管理
        path: '/path',
        name: 'Path',
        meta: {
            keepAlive: false //此组件不需要被缓存
        },
        component: () =>
            import ('@/views/Path.vue'),
        children: [{
                path: '/',
                name: 'path-index',
                meta: {
                    keepAlive: false //此组件不需要被缓存
                },
                component: () =>
                    import ('../views/path/Path-Index.vue')

            },
            {
                path: '/path-list',
                name: 'path-list',
                meta: {
                    keepAlive: false //此组件不需要被缓存
                },
                component: () =>
                    import ('@/views/path/Path-List.vue')
            }
        ]
    },
    {
        //提交订单界面
        path: '/order',
        name: 'Order',
        component: () =>
            import ('@/views/Order.vue')
    },
    {
        //支付成功或者失败跳转的页面
        path: '/payment',
        name: 'Payment',
        component: () =>
            import ('@/views/Payment.vue')
    },
];


const router = new VueRouter({
    mode: "hash",
    base: process.env.BASE_URL,
    routes,
});

router.beforeEach((to, from, next) => {
    let nextRouter = ['Payment', 'cart', 'Path', 'Order', 'path-index', 'path-list'];
    //是否是登陆中
    let userInfo = JSON.parse(localStorage.getItem('UserInfo'));
    //当前进入的页面，是不是需要验证的页面
    //to.name 路由的名称 to代表路由对象
    if (nextRouter.indexOf(to.name) >= 0) {
        if (!userInfo) {
            router.push('/login')
        }
    }
    next()
})

export default router;